<!-- 项目管理 -->
<template>
  <div class="page-box h100 display-flex czbj">
    <dxtable
      :dataJson="dataJson"
      :portUrl="portUrl"
      :formJson="formJson"
      :qx="qx"
      :czFun="czFun"
      :isshowXz="false"
      ref="databale"
    ></dxtable>
    <n-modal v-model:show="showModal" preset="card" class="Stock-diagnosis">
      <template #header>
        <div>签到明细</div>
      </template>
      <div>
        <div class="display-flex pm10">
          <div class="kkjmmserer vertical-center" style="width: 250px">
            <n-date-picker
              start-placeholder="签到日期"
              v-model:value="xcxcertyd"
              type="daterange"
              clearable
              :update-value-on-close="true"
            />
          </div>
          <div class="ml20">
            <n-button type="info" @click="ajsffgrfxert">搜索 </n-button>
          </div>
        </div>

        <n-data-table :columns="qdcolumns" :data="qddata" :bordered="true" />
      </div>
      <template #action>
        <div class="tr">
          <n-button @click="showModal = false"> 关闭 </n-button>
        </div>
      </template>
    </n-modal>
  </div>
</template>
<script lang="ts" setup>
import dxtable from "../../../components/util/dxtable.vue";
import sort from "../../../components/util/sort.vue";
import { dxget, dxpost } from "../../../util/index";
import { NButton, NImage, NTag } from "naive-ui";
import { h, ref, reactive } from "vue";
const fdfdsgta = ref([]);
const databale = ref();
const jxcxfd = [];
const kxcxdf = ref([]);
const jxcxrrrr = ref([]);
const jxcxvdfgre = ref();
const showModal = ref(false);
const ksjddfd = ref([]);
const xcxcertyd = ref(null);
let jxcxzcer = 0;
const qdcolumns = ref([
  {
    title: "课程名称",
    key: "kcname",
    align: "left",
  },
  {
    title: "学生姓名",
    key: "xname",
    align: "center",
  },
  {
    title: "签到老师",
    key: "jsname",
    align: "center",
  },
  {
    title: "签到日期",
    key: "qdri",
    align: "center",
  },
]);
const qddata = ref([]);
const initeer = () => {
  databale.value.initDataExpose();
};
let dataJson = [
  {
    title: "学校名称",
    key: "xxid",
    type: "select",
    options: [],
    width: "",
    search: true,
    render(row) {
      try {
        return ksjddfd.value.filter((a) => a.value == row.xxid)[0].label;
      } catch (e) {
        return "";
      }
    },
  },
  {
    title: "学生姓名",
    type: "input",
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "name",
    width: "",
    search: true,
    istable: true,
    required: false,
  },
  {
    title: "手机号",
    type: "input",
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "phone",
    width: "110",
    search: true,
    istable: true,
    required: false,
  },
  {
    title: "年级",
    type: "input",
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "nianji",
    width: "80",
    search: false,
    istable: true,
    required: false,
    render: (row) => {
      const xcgrte = [];
      fdfdsgta.value.map((a) => {
        row.nianji.split(",").map((b) => {
          if (a.value == b) {
            xcgrte.push(a.label);
          }
        });
      });
      return xcgrte.join(",");
    },
  },
  {
    title: "班级",
    type: "input",
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "banji",
    width: "80",
    search: false,
    istable: true,
    required: false,
  },
  {
    title: "第三节课",
    type: "input",
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "xczxdaname",
    width: "",
    search: false,
    istable: true,
    required: false,
    render(row) {
      try {
        let oxsdr = kxcxdf.value.filter((a) => a.id == row.xczxda)[0];
        return [
          h("span", { class: "red fz14 cz" }, "￥" + oxsdr.sfbz),
          h("span", { class: "z9 fz12 ml5 cz" }, `(${oxsdr.name})`),
        ];
      } catch (e) {
        console.log(e);
      }
      return row.xczxdaname;
    },
  },
  {
    title: "第四节课",
    type: "input",
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "xczxdbname",
    width: "",
    search: false,
    istable: true,
    required: false,
    render(row) {
      try {
        let oxsdr = kxcxdf.value.filter((a) => a.id == row.xczxdb)[0];
        return [
          h("span", { class: "red fz14 cz" }, "￥" + oxsdr.sfbz),
          h("span", { class: "z9 fz12 ml5 cz" }, `(${oxsdr.name})`),
        ];
      } catch (e) {}
      return row.xczxdbname;
    },
  },

  {
    title: "报名时间",
    key: "addTime",
    width: 150,
    type: "daterange",
    search: true,
  },
  {
    title: "应缴金额",
    key: "addTime",
    width: 150,
    render(row) {
      let jjccd = 0;
      jxcxrrrr.value.map((a) => {
        if (a.xsid == row.xsid && a.isxn == 1) {
          jjccd += parseFloat(a.sfbz);
        }
      });
      if (row.xczxda == row.xczxdb) {
        jjccd = jjccd * 2;
      }
      return "￥" + jjccd.toFixed(2);
    },
  },
];

const qx = {
  DeletePermissionID: "", //删除
  EditPermissionIdentifier: "23456", // 编辑
  NewPermissionIdentifier: "", // 新建
  ViewPermissionID: "", // 查看
};
const portUrl = "courseManagement/xwbmListjg/xwbmListjg";

let formJson = reactive([
  {
    title: "学生姓名",
    type: "input",
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "name",
    width: "",
    search: false,
    istable: true,
    required: true,
  },
  {
    title: "手机号",
    type: "input",
    val: "",
    icon: "dx-shurukuang",
    span: 12,
    key: "phone",
    width: "110",
    search: false,
    istable: true,
    required: true,
  },
  {
    title: "年级",
    type: "select",
    options: [],
    val: "",
    icon: "dx-shurukuang",
    span: 24,
    key: "nianji",
    width: "80",
    search: false,
    istable: true,
    required: false,
  },
  {
    title: "班级",
    type: "select",
    options: jxcxfd,
    val: "",
    icon: "dx-shurukuang",
    span: 24,
    key: "banji",
    width: "",
    search: false,
    istable: true,
    required: false,
  },

  {
    title: "",
    type: "",
    val: localStorage.xxxid,
    span: 24,
    key: "xxxid",
    istable: true,
    required: true,
  },
]);
const czFun = {
  fun: (row) => {
    return [
      h(
        NButton,
        {
          type: "info",
          quaternary: true,
          onClick: async (e) => {
            showModal.value = true;
            jxcxzcer = row.xsid;
            await ajsffgrfxert();
          },
        },
        "签到明细"
      ),
    ];
  },
};
const kcxcfsf = async () => {
  const { data } = await dxget("courseManagement/erqi/getxwkcList");
  console.log(data);
  kxcxdf.value = data;
};
kcxcfsf();

// 获取字典内容
const xtgxxmfl = async () => {
  const { data }: any = await dxget("dxgjAdmin/getzd/getzdJsList?ids=316,343");
  fdfdsgta.value = data[0];
  formJson[2].options = data[0];
  formJson[4].options = data[1];
};
xtgxxmfl();

const ajsffgrf = async (xsid?) => {
  const { data } = await dxget("courseManagement/erqi/xwajsffgrf");
  jxcxrrrr.value = data;
};
const ajsffgrfxert = async (xsid?) => {
  let dccxdew = "";
  try {
    dccxdew = xcxcertyd.value.join(",");
  } catch (e) {}
  const { data } = await dxget("courseManagement/erqi/xwajsffgrf", {
    xsid: jxcxzcer,
    qdri: dccxdew,
  });
  qddata.value = data;
};
ajsffgrf();
const getschoolManagement = async () => {
  const { data }: any = await dxget(
    "courseManagement/erqi/getschoolManagement"
  );
  ksjddfd.value = data;
  dataJson[0].options = [
    {
      label: "全部",
      value: "",
    },
    ...data,
  ];
};
getschoolManagement();
</script>
<style scoped></style>
